<template>
  <view class="tui-skeleton">
    <!-- #ifndef APP-NVUE -->
    <scroll-view
      v-if="list.length"
      class="flex-column flex-item"
      :scroll-top="top"
      :style="{height:height+'px'}"
      :refresher-triggered="refresh"
      lower-threshold="100"
      refresher-enabled
      enable-back-to-top
      scroll-y
      @scrolltolower="nextPage"
      @refresherrefresh="refresherrefresh"
    >
      <view class="flex-column padding-lr-30">
        <view v-for="(item, index) in list" :key="index">
          <order-card :item="item" type="hook" />
        </view>
      </view>
      <l-footer :has-more="hasMore" />
    </scroll-view>
    <!-- #endif -->
    <!-- #ifdef APP-NVUE -->
    <list v-if="list.length" class="flex-column flex-item" :show-scrollbar="false" :scrollable="true" :offset-accuracy="5" loadmoreoffset="100" :bounce="false" fix-freezing="true">
      <cell v-for="(item, index) in list" :key="index">
        <view class="padding-lr-30">
          <order-card :item="item" type="hook" />
        </view>
      </cell>
      <cell @appear="nextPage">
        <l-footer :has-more="hasMore" />
      </cell>
    </list>
    <!-- #endif -->
    <view v-else :style="{height:height+'px'}">
      <tui-skeleton v-if="showSkeleton" :preload-data="preloadData" />
      <l-no-data v-else type="order" text="暂无数据" />
    </view>
  </view>
</template>

<script>
import request from '@/common/api/request'
import { getCompanyHookList } from '../../api'
import { preloadData } from './index'
export default {
  name: 'HookPage',
  props: {
    type: {
      type: [Number, String],
      default: 0
    },
    height: {
      type: Number,
      default: 0
    }
  },
  data() {
    return {
      list: [],
      page: 1,
      pageSize: 10,
      hasMore: true,
      showSkeleton: true,
      refresh: false,
      top: 0,
      preloadData
    }
  },
  methods: {
    // 获取列表
    async getHookList() {
      const [err, res] = await getCompanyHookList({
        status: this.type,
        page: this.page,
        size: this.pageSize
      })
      uni.stopPullDownRefresh()
      this.refresh = false
      this.showSkeleton = false
      if (!request.errorCheck(err, res)) return false
      let hookList = res.data.data.records
      if (!hookList) hookList = []
      if (hookList.length < this.pageSize) this.hasMore = false
      if (this.page === 1) this.list = hookList
      else this.list.push(...hookList)
    },
    reload() {
      this.hasMore = true
      this.page = 1
      this.getHookList()
    },
    nextPage() {
      if (this.hasMore) {
        this.page++
        this.getHookList()
      }
    },
    refresherrefresh() {
      this.refresh = true
      this.reload()
    },
    clear() {
      this.page = 1
      this.list = this.list.slice(0, this.pageSize * this.page)
      this.top = this.top ? 0 : 1
    }
  }
}
</script>

<style scoped>

</style>
